import React from "react";
import { useNavigate } from "react-router-dom";
import { Form, Input, Button } from "antd";
import { UserOutlined, LockOutlined } from "@ant-design/icons";

export default () => {

	const navigate = useNavigate();


	const onFinish = ({ username, password }) => {
		console.log(username, password);
	};

	return (
		<div className="min-h-screen flex justify-center items-center">
			<Form
				name="normal_login"
				initialValues={{
					remember: true,
				}}
				onFinish={onFinish}
			>
				<Form.Item
					name="username"
					rules={[
						{
							required: true,
							message: "请输入账号",
						},
					]}
				>
					<Input
						prefix={<UserOutlined className="site-form-item-icon" />}
						placeholder="账号"
					/>
				</Form.Item>
				<Form.Item
					name="password"
					rules={[
						{
							required: true,
							message: "请输入密码",
						},
					]}
				>
					<Input
						prefix={<LockOutlined className="site-form-item-icon" />}
						type="password"
						placeholder="密码"
					/>
				</Form.Item>

				<Form.Item>
					<Button type="primary" htmlType="submit">
						注册
					</Button>
					Or <a href="/login">立即登陆</a>
				</Form.Item>
			</Form>
		</div>
	);
};
